We Distribute

2024-05-01 20:41:25

How to Stream to PeerTube or Owncast with OBS Studio

It’s never been a better time to be a streamer on the Fediverse. There are two great options available, and they’re both worth checking out: PeerTube, a community video platform from Framasoft, and Owncast, a Twitch-like streaming platform by Gabe Kangas.
Left: PeerTube. Right: Owncast.
Today, we’re going to talk about getting set up with OBS Studio, which has long been the gold standard for streamers. It’s cross-platform, open source, offers a ton of different plugins, and is easy to use!

Table of Contents

• Which One Should I Choose?
  
  • Owncast
  • PeerTube

  
  

• Getting Started
  
  • Owncast
  • PeerTube

  
  

• Plugging in OBS Studio
• Setting Up Chat
  
  • Owncast
  • PeerTube

  
  

• Embedding Chat
  
  • Using Owncast Chat
  • Using PeerTube Chat

  
  

• In Conclusion

Which One Should I Choose?

If you’re looking to livestream, either choice is totally valid. A few considerations:

Owncast

Owncast is the more lightweight option: it’s easy to get up and running yourself, and is designed as one streamer per server. Chat is also a first-class citizen here, with extensive tools that are available right in the dashboard for moderation. It’s a great option if you’re just looking at hosting a single-user server that people can tune into.

PeerTube

PeerTube is a full-fledged video platform, with a catalogue, search, and channels. Live Streaming is a newer feature, built right into the system. Running your own PeerTube server is a bit more challenging than OwnCast, but you get the benefit of saving your videos after streaming, and it can coexist with other channels focused on other things.

One negative against PeerTube’s offering is that the live chat system is not officially part of the platform, but is instead a plugin that your admin has to set up. This means there’s a little bit more friction

Getting Started

The main thing you’re going to need is your RTMP Stream URL, and your corresponding Stream Key. Depending on which platform you’re going with, this can exist in two very different places.

Owncast

Owncast makes finding these things dead simple: because you only have one account and one stream, these values exist in your Home section, and the Stream Key lives under the Stream Keys tab in Server Settings.

PeerTube

PeerTube does this a little bit differently: because it’s possible to have multiple streams, these values instead exist in the entry for your PeerTube Live, which is what PeerTube refers to as a video with live streaming features.

If you haven’t created a Live yet, click on the Publish button in the top-right of the screen, and select Go Live. You will need to choose whether this is a one-time broadcast, or a recurring broadcast that you’ll be using frequently.

Plugging in OBS Studio

Once you have your RMTP Stream URL and Stream Key, open up OBS Studio. Click on Settings, and go to the Stream tab. For Service, you’re going to select Custom.

When you connect for the first time, OBS Studio will perform a brief stress test to decide the ideal settings for your stream. Whether you’re using OwnCast or PeerTube, you should be able to see yourself go live without any issue.

Setting Up Chat

A cornerstone for any live stream involves chat capabilities, and both platforms deliver different offerings. Owncast conveniently offers a built-in chat with the platform, whereas PeerTube requires a plug-in for that feature to work.

The good news is that the end result for both platforms is excellent, and can work great with your streaming setup.

Owncast

Since Owncast chat is built right in, it works automatically for your stream. You can moderate messages at admin/chat/messages/, moderate users at /admin/chat/users/, and add custom emoji at /admin/chat/emojis/ .

Additionally, you can turn off the chat entirely or add a little bit of gatekeeping at /admin/config-chat/

PeerTube

With PeerTube, you’ll need to make sure that your instance has the peertube-plugin-livechat package installed. If not, you’ll need to ask your admin to include it.

Once the plugin is installed, you will be able to find the settings for your chatrooms in the sidebar. Each of your channels has a dedicated chatroom: if you have multiple live streams set up on a given channel, the config will be the same for each chat.

One last noteworthy bit is that you can set up a moderation bot for your chat that filters forbidden words, and also follow custom commands.

Embedding Chat

A lot of streamers like to incorporate a chat window into their streams! Both platforms support this in different ways, but you can capture and render them using the Browser Source in OBS Studio.

Set the bottom edge of your Chat like so.

When placing the Browser Source for your chat, we recommend giving the widget the height of your video, with the bottom edge of the widget against the bottom edge of the screen. As more messages enter the chat, your widget size will grow, so it’s important to keep the bottom edge aligned.

Before doing anything, you’re going to want to create a Browser Source in your scene. In your Scene, go to Sources, click the plus button, then pick Browser Source.

A dialog will pop up in OBS Studio. Use the link that you got from the last step as your URL value, then set the width and the height. My video capture is 1920 x 1080, so I set the Height value as 1920. I also set the FPS value to match my camera’s capture rate, which is 60FPS.

Using Owncast Chat

Create your Browser Source, and use your equivalent to this Chat URL: http://localhost:8080/embed/chat/readonly, substituting localhost:8080 for whatever domain you’re broadcasting from.

The theme system for Owncast Chat feels a little bit obtuse, but here’s my best attempt to make it look better with Custom CSS and transparency. When I have more time, I may write a few different custom styles for it.
body { background-color: rgba(0, 0, 0, 0) !important; margin: 0px auto; overflow: hidden !important; }.ChatContainer_chatContainer__jj1A1 { flex: 0 0 auto; display: flex; flex-direction: column; background-color: #0000; height: 100%; font-size: 20px !important;}.ChatUserMessage_root__wl4Pw .ChatUserMessage_message__JJiP9 { overflow: hidden; overflow-wrap: anywhere; font-weight: 800; position: relative; font-size: 20px;}

Using PeerTube Chat

Create your Browser Source, then get the link from the PeerTube Live chat from where you’re broadcasting. You’ll see this with the little “link” button in the chatroom. Afterwards, a dialogue will appear with some options: we recommend setting a transparent background for OBS Studio.

There’s also a Custom CSS section to customize the output. The chat plugin uses ConverseJS, which is a little bit harder to theme. I managed to bang out a very basic user theme to make it look a bit better, but struggled to change the color of user names.

Here’s a copy of the Custom CSS I used for mine:
body { background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; }.conversejs .show-msg-author-modal a { color: #7c71ff !important; text-shadow: 1px 1px 2px #737272;}.conversejs .message.chat-msg .chat-msg__content { text-shadow: 1px 1px 1px #000; color: #fff !important;}.conversejs .message.chat-msg .chat-msg__text { color: #fff; font-weight: 800; font-size: 20px;}.conversejs .align-self-center, .conversejs .align-self-center image { width: 60px; height: 60px;}.conversejs .message.chat-msg { margin-top: 10px; margin-bottom: 10px;}.conversejs .chat-msg__author { font-size: 140% !important;}

In Conclusion

We hope that this guide was helpful in getting you started with streaming on the Fediverse! We will periodically update this guide with more info and resources as we continue to explore, but this is a solid starting point for getting up and running.

If you have any questions, ask in the comments, and we’ll look at incorporating your feedback!

What is PeerTube? | JoinPeerTube

A free software to take back control of your videos! With more than 600,000 hosted videos, viewed more than 70 millions times and 150,000 users, PeerTube is the decentralized free software alternative to videos platforms developed by Framasoft

^JoinPeerTube